<template>
  <view class="bd t1">
    <view class="citem inp-item uni-item-line flex flex-al-c">
      <view class="inp-title" style="width: 200upx">所属区域</view>
      <simpleAddress @done="getAddress1"></simpleAddress>
    </view>
    <!-- 		<view style="padding: 0 30upx;margin: 20upx 0;">
			<u-search placeholder="搜索社区" v-model="keyword"></u-search>
		</view> -->
    <view
      v-for="(v, index) in list"
      :key="index"
      class="citem flex flex-j-b flex-al-c uni-item-line"
    >
      <view class="name">{{ v.deptName }}</view>
      <u-tag
        :text="v.adequates"
        v-if="v.adequate == '0'"
        text="库存充足"
        type="success"
        size="mini"
      />
      <u-tag
        :text="v.adequates"
        type="error"
        text="无库存"
        size="mini"
        v-if="v.adequate == '2'"
        style="background-color: #fee7e3; color: red; border-color: #fed4d4"
      />
      <u-tag
        :text="v.adequates"
        type="warning"
        text="库存紧缺"
        size="mini"
        v-if="v.adequate == '1'"
        mode="light"
      />
    </view>
    <!-- <view class="citem flex flex-j-b flex-al-c uni-item-line">
			<view class="name">西湖社区卫生服务中心</view>
			<u-tag text="库存充足" type="error" size="mini"
				style="background-color: #007AFF;color: #fff;border-color: #007AFF;" />
		</view>
		<view class="citem flex flex-j-b flex-al-c uni-item-line">
			<view class="name">蔚来天才服务中心</view>
			<u-tag text="库存不足" type="error" size="mini"
				style="background-color: #F7BB3B;color: #fff;" />
		</view> -->
  </view>
</template>

<script>
import simpleAddress from "../../../../components/my-simple-adress/simple-address.vue";
export default {
  components: {
    simpleAddress,
  },
  data() {
    return {
      keyword: "",
      area: "", //地区
      vid: "",
      vaccStock: {},
      list: [],
    };
  },
  onLoad(options) {
    this.vid = options.vid;
    //console.log(this.vid)
    this.goData();
    this.getDeptVaccines();
  },
  onReady() {
    // this.getUiStyle();
  },
  methods: {
    getUiStyle() {
      var style = plus.navigator.getUiStyle();
      if ("dark" == style) {
        console.log("当前为暗黑模式");
        uni.setTabBarStyle({
          backgroundColor: "#1B1C1E",
        });
        uni.setNavigationBarColor({
          frontColor: "#ffffff",
          backgroundColor: "#1B1C1E",
          animation: {
            duration: 400,
            timingFunc: "easeIn",
          },
        });
      } else {
        console.log("当前为普通模式");
      }
    },
    getAddress1(res) {
      //console.log(res.areaCode)
      this.area = res.areaCode;
      this.config
        .get("/vaccinesBasicsInfo/getVaccinessByDept", {
          areaCode: res.areaCode,
          vId: this.vid,
        })
        .then((res) => {
          console.log(res);
          if (res.data.code === 200) {
            this.list = res.data.data;
          } else {
          }
        });
    },
    goData() {
      //console.log(this.vid);
      this.config
        .get("/vaccinesBasicsInfo/getVaccinessByDept", {
          areaCode: "",
          vId: this.vid,
        })
        .then((res) => {
          console.log(res);
          if (res.data.code === 200) {
            this.list = res.data.data;
          } else {
          }
        });
    },
    getDeptVaccines() {
      //console.log(this.vid);
      this.config
        .get("/vaccinesBasicsInfo/getVaccinessByDept", {
          areaCode: "",
          vId: this.vid,
        })
        .then((res) => {
          console.log(res);
          if (res.data.code === 200) {
            this.list = res.data.data;
          } else {
          }
        });
    },
  },
};
</script>

<style lang="less">
@media (prefers-color-scheme: light) {
  page {
    background-color: #ffffff !important;
  }
}
.citem {
  padding: 30upx;
  .name {
    width: 500upx;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
    margin: 0 0 10upx;
  }
  .u-tag {
    border: none;
  }
}
</style>
<style scoped>
@media (prefers-color-scheme: closedark) {
  page {
    background-color: #1b1c1e;
    height: calc(100vh - var(--window-top));
  }
  .bd {
    background-color: #1b1c1e !important;
  }
  .bd1 {
    background-color: #38383c !important;
  }
  .t1 {
    color: #ccc !important;
  }
  >>> input {
    color: #ccc !important;
  }
}
</style>